<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>账单详情</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../../../css/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="../../../css/pages/home/ball.css"/>
	</head>

	<body>
		<div id="app" class="content p-15">
			<div class="detail-title m-b-10">
				<div class="time m-b-10">{{year}}年{{month}}月账单</div>
				<div class="desc font-c-7f font-16" v-text="hosing.neiName+hosing.buiName+hosing.eleName+hosing.roomEncode"></div>
			</div>
			<div class="detail-desc">
				<ul class="mui-table-view" v-for="item in datas.billingDetailsList">
					<li class="mui-table-view-cell">
						<span class="font-c-41" v-text="item.typeName"></span><span class="font-c-7f">{{item.money}}元</span>
					</li>
				</ul>
				<div class="p-20">
					<div class="settlement-item">
						<span>总金额</span><span>{{datas.totalAmount}}元</span>
					</div>
					<div class="settlement-item">
						<span>已支付</span><span>{{datas.amountPaid}}元</span>
					</div>
					<div class="settlement-item">
						<span>待支付</span><span class="font-c-min">{{datas.amountToBePaid}}元</span>
					</div>
				</div>
			</div>
		</div>
		<script src="../../../js/Width.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/Util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
		<script type="text/javascript">
			mui.init()
			
			
			mui.plusReady(function () {
				var hosing = Util.getState('hosing');
				app.hosing = hosing;
				
				if (!mui.os.android) {
					FastClick.attach(document.body);
				}
				var seif = plus.webview.currentWebview();
				app.year = seif.year
				app.month = seif.month
				getMonthBill(hosing,seif)
				seif.setStyle({
					titleNView:{
						backgroundColor: "#FFFFFF",
						titleText: "账单详情",
						autoBackButton: true,
						splitLine:{
							height: "1px",
							color: "#EEEEEE"
						}
					}
				})	
			})
			var app = new Vue({
				el: '#app',
				data: {
					year: '',
					month: '',
					datas: {},
					hosing:{}
				},
				methods: {
					
				}
					
			})
			
			function  getMonthBill(hosing,seif) {
				mui.post(Util.HTTP + 'api/Bill/GetMonthBill',{
					neiID: hosing.neiID,
					buiID: hosing.buiID,
					eleID: hosing.eleID,
					roomID: hosing.roomID,
					userID: hosing.userID,
					year: seif.year,
					month: seif.month
				},function(res){
					if(res.code==1001){
						app.datas = res.data
					}
				})
			}
			
		</script>
	</body>
</html>